<div class="uk-container" ng-controller="apisCtrl" style="margin-left: 80px; margin-top: 20px">
    <div class="uk-grid">
        <div class="uk-width-10-10" style="margin-bottom: 10px">
            <div class="uk-grid uk-margin-top uk-margin-bottom">
                <div class="uk-width-6-10">
                    <ul class="uk-breadcrumb uk-vertical-align-middle uk-margin-left">
                        <li><span>我的项目</span></li>
                    </ul>
                </div>
                <div class="uk-width-4-10">
                    <div style="margin-right: 60px !important;">
                        <div class="uk-float-right">
                            <a ui-sref="project.add_api({project_id:project_id})" class="uk-button uk-button-success"><span class="uk-icon-plus" style="margin-right: 5px"></span><span class="uk-visible-large">添加API</span></a>
                            <a ui-sref="project.edit_project({project_id:project_id})" class="uk-button uk-button-success"><span class="uk-icon-cog" style="margin-right: 5px"></span><span class="uk-visible-large">项目管理</span></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="uk-width-9-10" style="margin-left: 5%">
            <form class="uk-form">
                <div class="uk-form-row">
                    <label class="uk-text-bold">分组查看</label>
                    <select ng-model="groupSelected" ng-options="group.id as group.name for group in groups"></select>
                    <label class="uk-margin-left uk-text-bold">排序方式</label>
                    <select ng-model="sortBy">
                        <option value="time">按时间排序</option>
                        <option value="url">按url排序</option>
                    </select>
                    <label class="uk-margin-left uk-text-bold">状态</label>
                    <select ng-model="finish">
                        <option value="all">所有</option>
                        <option value="finished">已完成</option>
                        <option value="unfinished">未完成</option>
                    </select>
                    <a href="" class="uk-button uk-button-primary uk-margin-left" ng-click="query()">查询</a>
                    <a href="" class="uk-button uk-button-primary uk-margin-left uk-float-right" ng-click="addGroup()">添加分组</a>
                    <input class="uk-float-right" placeholder="分组名称" ng-model="newGroup">
                </div>
            </form>
            <div class="uk-panel uk-panel-box uk-margin-top">
                <div class="uk-grid">
                    <div class="uk-width-1-1">
                        <table class="uk-table uk-table-hover uk-width-1-1" style="table-layout:fixed;">
                            <thead>
                                <tr>
                                    <th class="uk-width-3-10 uk-text-center" style="max-width: 20%">url</th>
                                    <th class="uk-width-5-10 uk-text-center">描述</th>
                                    <th class="uk-width-2-10 uk-text-center">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr ng-repeat="apiItem in apiList">
                                    <td class="uk-text-center" style="word-break:break-all;">{{apiItem.url}}</td>
                                    <td class="uk-text-center">{{apiItem.description}}</td>
                                    <td class="uk-text-center">
                                        <a ui-sref="project.edit_api({api_id:apiItem.id,project_id:project_id})" class="uk-button uk-button-success uk-margin-right"><span class="uk-icon-cog" style="margin-right: 5px"></span><span class="uk-visible-large">编辑</span></a>
                                        <a class="uk-button uk-button-danger" data-uk-modal href="#deleteDialog" ng-click="deleteApiHelp(apiItem)"><span class="uk-icon-close" style="margin-right: 5px"></span><span class="uk-visible-large">删除</span></a>
                                        <div class="uk-modal" id="deleteDialog">
                                            <div class="uk-modal-dialog">
                                                <a class="uk-modal-close"></a>
                                                <div class="uk-margin uk-modal-content">
                                                    <h3 class="uk-text-bold">确定删除该项目吗？</h3>
                                                </div>
                                                <div class="uk-modal-footer uk-text-right">
                                                    <a class="uk-button uk-button-danger" ng-click="deleteApi(api2delete)">删除</a>
                                                    <a class="uk-modal-close uk-button">取消</a>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
